<template>
    <Card>
        <Row>
            <Tabs @on-click="changeTab"  :value="tabName" type="card" :animated="false">
                <TabPane icon="ios-at" name="not-created"  label="凭证未创建">
                    <voucherFlowInfo ref="voucherFlowInfo"  @changeTab="changeTab" :status="'notCreated'"  ></voucherFlowInfo>
                </TabPane>
                <TabPane icon="ios-at" name="created"  label="凭证已创建">
                    <voucherFlowInfo ref="voucherFlowInfo"  @changeTab="changeTab" :status="'created'"  ></voucherFlowInfo>
                </TabPane>
                <TabPane icon="ios-at" name="fail-created"  label="凭证创建失败">
                    <voucherFlowInfo ref="voucherFlowInfo"  @changeTab="changeTab" :status="'failCreated'"  ></voucherFlowInfo>
                </TabPane>
            </Tabs>
        </Row>
    </Card>
</template>
<script>
    import voucherFlowInfo from './voucherFlowInfo'

    export default {
        components:{
            voucherFlowInfo:voucherFlowInfo,
        },
        data(){
            return {
                tabName:'not-created'
            }
        },
        methods:{
            changeTab(){
                this.$refs['voucherFlowInfo'].refresh();
            }
        }
    }
</script>
